<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML>
<html>
<head>
	<meta charset="UTF-8">
	<title></title>
	<link rel="stylesheet" href="../css/bootstrap.min.css">
	<style type="text/css">
		
body{
	margin:0px;
	padding:0px;
	font-size:13px;
	font-family: Trebuchet MS,Liberation Sans,DejaVu Sans,sans-serif;
	background:url(../img/2.jpg) center center fixed;
	color:black;
	
}

#mylogo{
		position: absolute;
		top: 10px;
		left: 200px;
		background: url(../img/t.jpg);
		height:90px;
		width: 192px;

	}



.top1{
	background-color:#25304C;
	height:100px;
	line-height:26px;
}
.top1 .top2{
	width:980px;
	height:26px;
	margin:0 auto;
	line-height:26px;
	
}
.top1 .top2 .top_left{
	width:113px;
	height:17px;
	float:left;
	margin-top:6px;
}
.top1 .top2 .top_right{
	width:602px;
	height:22px;
	float:right;
	margin-top:1px;
	line-height:22px;

}
.top1 .top2 .top_right a{
	margin-left:25px;
	color:#78C16F;
	font-weight:bold;
	text-decoration:none;

}
.top1 .top2 .top_right a:hover{
	text-decoration:underline;
}
.con{
		width: 950px;
		
		background-color: #fff;
		margin: 0 auto;
	}

	.gouwu{
		height:30px;
		
	}
	.jindu{
		width:200px;
		height:25px;
		text-align:center;
		margin-left:10px;
		display: inline-block;
		font-weight: bold;
		line-height: 25px;
	}


.bottom{
	width:100%;
	background-color:#FFF;
	margin-top:40px;
}
.bdiv1{
	width:920px;
	margin:auto;

	padding:20px;
	position:relative;
}
.bdiv4{
	margin-bottom:20px;
	color:gray;
}
.bdiv4 a{
	font-size:12px;
	font-weight:bold;
	color:gray;
	text-decoration:none;
	
}

.bdiv5{
	color:#999999;
	font-size:12px;
	font-weight:bold;
	margin-bottom:20px;

}
.bdiv5 a{
	text-decoration:none;
	color:#999999;
}
.bdiv5 a:hover{
	color:#385f8a;
}
.bdiv6{
	font-size:12px;
	color:#e2e2e2;
	padding-bottom:20px;
}
.bdiv7{
	position:absolute;
	right:10px;
	top:36px;
	
}
.bdiv8{
	position:absolute;
	right:10px;
	border:#778087;
	font-size:13px;
	text-decoration:none;
	top:80px;
	color:#778087;
}

.bdiv8:hover{
	color:#4d5256;
	text-decoration:underline;
}
	.con{
		width: 1000px;
		background-color: #fff;
		margin: 0 auto;
	}


	</style>


</head>
<body>
		<%@ include file="include/top.jsp"%>
		
		
	<div style="">
		
		<ul class="breadcrumb" style="height:20px;background-color:#1E2537;border-radius: 0px;margin-bottom:0px;">
			<div id="" class="container">
				 <li><a href="index.jspx">Home</a> <span class="divider">/</span></li>
				  <li><a href="showcar.jspx">购物车</a> <span class="divider">/</span></li>
				  <li class="active">结账</li>
			</div>
		 
		</ul>
	</div>






	<div class="con" style="padding:25px;">
		<div class="container">

			<div class="gouwu">
				
				<div class="jindu" style="background-color:#FFEDA2;">
					1.拍下商品
				</div>
				<div class="jindu" style="background-color:#990D1B;color:#fff;">
					2.确认订单信息
				</div>
				<div class="jindu" style="background-color:#E4E4E4;">
					3.确认收货
				</div>
				<div class="jindu" style="background-color:#E4E4E4;">
					4.对商家评价
				</div>
				
				
			</div>


			<h3><i class="icon-th-list" style="margin-top:6px;"></i>订单信息</h3>
			<hr/>
			<!--收货人信息-->
			<form class="form-horizontal" action="submitorder.jspx" method="post" id="myform">
				  <div class="control-group">
					    <label class="control-label" for="inputEmail"><span style="color:red;">*</span>收货人姓名</label>
					    <div class="controls">
					      	<input type="text" id="inputEmail" placeholder="收货人姓名" name="username">
					    </div>
				  </div>
				  <div class="control-group">
					    <label class="control-label" for="inputEmail"><span style="color:red;">*</span>收货地址</label>
					    <div class="controls">
					      	<input type="text" id="inputEmail" placeholder="收货地址" name="address">
					    </div>
				  </div>
				  <div class="control-group">
					    <label class="control-label" for="inputEmail"><span style="color:red;">*</span>联系电话</label>
					    <div class="controls">
					      	<input type="text" id="inputEmail" placeholder="联系电话" name="tel">
					    </div>
				  </div>
				  <div class="control-group">
					    <label class="control-label" for="inputEmail">备注</label>
					    <div class="controls">
					      	<input type="text" id="inputEmail" placeholder="备注" name="beizhu">
					    </div>
				  </div>
				  
				 
			


			<!--付款方式-->
			<h3><i class="icon-star" style="margin-top:6px;"></i>付款方式</h3>
			<hr/>
			<div style="margin-left:150px;">
				<label class="radio">
				  <input type="radio" name="optionsRadios" id="optionsRadios1" value="货到付款" checked>
				  <img src="../img/renminbi.jpg" width="30" height="25" alt="">货到付款
				</label>
				<label class="radio">
				  <input type="radio" name="optionsRadios" id="optionsRadios2" value="支付宝">
				  <img src="../img/zhifubao.jpg" width="50" height="25" alt="">支付宝
				</label>
			</div>
			
			
			</form>


			<h3><i class=" icon-shopping-cart" style="margin-top:6px;"></i>购物车</h3>
			<hr/>

			<!--购物单表-->
						<div style="padding:10px;border:1px solid #CCCCCC;margin-top:10px;">
				    				<table class="table table-hover" style="margin-top:15px;">
				    					<thead>
				    						<tr>
				    							
				    							<th>商品名称</th>
				    							<th>单价</th>
				    							<th>数量</th>
				    							<th>总价</th>
				    							<th style="width:30px;">删除</th>
				    						</tr>
				    					</thead>
				    					<tbody>
				    						<c:if test="${empty sessionScope.carshop }">
				    							<td colspan="5">您还没有添加任何商品！！</td>
				    							
				    						</c:if>
				    						<c:forEach items="${sessionScope.carshop }" var="s">
				    							<tr>
					    							<td><a href="showbook.jspx?id=${s.book.id }">${s.book.bookname }</a></td>
					    							<td>${s.book.salesprice }</td>
					    							<td>${s.num }</td>
					    							<td>${s.total }</td>
					    							<td><a href="removelist.jspx?bookid=${s.book.id }" title=""><i class="icon-remove"></i></a></td>
					    						</tr>
					    						<c:set var="total" value="${total + s.total}"/>
				    						</c:forEach>
				    							
					    						<tr>
					    							<td  colspan="5" style="font-size:18px;text-align:right;font-weight:bold;color:#ff7400">总价为：￥${not empty total ? total : 0 }</td>
					    							
					    						</tr>
				    					</tbody>

				    					
				    				</table>
				    			</div>
							    			

				 <!--按钮-->
				 <div style="float:right;margin-top:10px">
				 	<a href="showcar.jspx" type="btn" class="btn btn-success"><i class="icon-edit icon-white"></i>修改订单</a>
				 	<a href="javascript:;" id="submita" type="btn" class="btn btn-primary"><i class="icon-ok icon-white"></i>提交订单</a>
				 </div>

				 <div style="clear:both">
				 	
				 </div>
				 <footer>
					 <hr>
					<font>© 2012-2013 <i class="icon-hand-right"></i> 夼趸蒋</font>
				</footer>
		</div>
		
	</div>
	<div class="bottom" style="background-color:#25304C;margin-top:0px;">
		<div class="bdiv1">
			<div class="bdiv2">
				<div class="bdiv4">
					<a href="#"> 关于 </a>|<a href="#"> FAQ </a>|<a href="#"> 我们的愿景 </a>|<a href="#"> 博客 </a>|<a href="#"> 广告投放 </a>|<a href="#"> 工作空间 </a>|<a href="#"> 上网首页 </a>
				</div>
				<div class="bdiv5">
					<span>创意工作者们的社区</span><br/>
					<span>Lovingly made by</span>
					<a href="#">OLIVIDA</a>
				</div>
				<div class="bdiv6">
					<span>VERSION: 2.5.0-dev-5</span><br/><span>Do have a faith in what you're doing.</span>
				</div>
			</div>
			<div class="bdiv3">
				<div class="bdiv7">
					<a href="#"><img src="../img/linode.png"/></a><br/>
				</div>
				<div>
					<a href="#" class="bdiv8">Linode-互联网上最好的主机</a>
				</div>
				
					
				
					
			</div>
		</div>	
			
	</div>
	<script type="text/javascript" src="../js/jquery.js"></script>
	<script type="text/javascript">
		$(document).ready(function(){
			$("#submita").click(function(){
				$("#myform").submit();
			});
		});
	</script>

</body>
</html>